<template>
  <el-dialog
    ref="dialog"
    title="确认图纸"
    :visible.sync="visible"
    :close-on-click-modal="false"
    :close-on-press-escape="false"
    :before-close="clearForm"
    width="600px"
    top="8vh"
    @close="closeDialog"
  >
    <!-- <c-dialog ref="dialog" :data="selData" single title="确认图纸" destroy-on-close @open="openHandle"> -->
    <c-list ref="form" :model="formData" :rules="formRules" label-width="120px">
      <c-list-item label="确认结果" prop="customerConfirmResult">
        <el-select v-model="formData.customerConfirmResult" placeholder="确认结果" clearable filterable @change="v=>$set(formRules.customerFeedbackAdvice[0], 'required', v === '0')">
          <el-option value="1" label="同意" />
          <el-option value="0" label="不同意" />
        </el-select>
      </c-list-item>
      <c-list-item label="反馈意见" prop="customerFeedbackAdvice">
        <el-input v-model="formData.customerFeedbackAdvice" type="textarea" maxlength="1024" show-word-limit :autosize="{minRows:3}" placeholder="反馈意见" clearable />
      </c-list-item>
      <c-list-item label="图纸确认附件" prop="shopAttachmentDTOList">
        <c-file-list v-model="formData.shopAttachmentDTOList" type-code="ACCESS135" view-type="image" :model-id="detail.id" />
      </c-list-item>
      <c-list-item>
        <div class="btn-container">
          <c-button @click="cancelHandle">取消</c-button>
          <c-button key="confirm" type="primary" @click="confirmHandle">确认</c-button>
        </div>
      </c-list-item>
    </c-list>
  </el-dialog>
  <!-- </c-dialog> -->
</template>
<script>
import { postAddMaintainToExamine } from '@/api/shopDrawing'
export default {
  name: 'AuditDraw',
  components: {
  },
  props: {
    visible: {
      type: Boolean,
      default: false
    },
    selData: {
      type: Array,
      default: () => []
    }
  },
  data() {
    const validateAA = (r, v, c) => {
      if (this.formData.customerConfirmResult === '0' && this.formData.customerFeedbackAdvice === '') {
        c(new Error('请输入反馈意见'))
      } else {
        c()
      }
    }
    const validatorFiles = (r, v, c) => {
      if (!(v instanceof Array) || this.$getFiles(v, this.detail.id).filter(e => e.dr !== 1 && e.dr !== '1').length === 0) {
        c(new Error('请上传图纸确认附件'))
      } else {
        c()
      }
    }
    return {
      formData: {
        customerConfirmResult: '',
        customerFeedbackAdvice: '',
        shopAttachmentDTOList: []
      },
      formRules: {
        customerConfirmResult: [{ required: true, message: '请选择确认结果', trigger: 'change' }],
        customerFeedbackAdvice: [{ validator: validateAA, trigger: 'change' }],
        shopAttachmentDTOList: [{ required: true, validator: validatorFiles, trigger: 'change' }]
      }
    }
  },
  computed: {
    detail() {
      return this.selData.length === 0 ? {} : this.selData[0]
    }
  },
  methods: {
    clearForm() {
      this.closeDialog()
    },
    closeDialog() {
      this.$emit('update:visible', false)
    },
    openHandle() {
      // this.formData.push(...(this.detail || []))
    },
    confirmHandle() {
      return this.$refs.form.validate().then(() => {
        const data = { ...this.detail }
        data.customerConfirmResult = this.formData.customerConfirmResult
        data.customerFeedbackAdvice = this.formData.customerFeedbackAdvice
        data.shopAttachmentDTOList = this.$getFiles(this.formData.shopAttachmentDTOList, this.detail.id)
        data.type = '0' // 1 客户经理 0 经销商
        return postAddMaintainToExamine(data).then(res => {
          this.$message.success('操作成功！')
          this.$refs.dialog.visible = false
          this.$emit('on-success')
        })
      })
    },
    cancelHandle() {
      return this.$msgbox({
        message: '是否取消当前操作？',
        title: '取消',
        showCancelButton: true,
        type: 'warning'
      }).then(() => {
        this.closeDialog()
      })
    }
  }
}
</script>
